instantsearch.js

What is instantsearch.js?

instantsearch.js is a library for building performant and instant search experiences with Algolia. It provides a set of widgets and tools to create highly customizable search interfaces.

What are instantsearch.js's main functionalities?

Search Box

The search box widget allows users to input their search queries. It connects to the Algolia index and fetches results based on the user's input.

const search = instantsearch({
  indexName: 'instant_search',
  searchClient: algoliasearch('YourApplicationID', 'YourSearchOnlyAPIKey')
});

search.addWidget(
  instantsearch.widgets.searchBox({
    container: '#searchbox'
  })
);

search.start();

Hits

The hits widget displays the search results. It can be customized to show different attributes of the search results and highlight the matching parts of the query.

search.addWidget(
  instantsearch.widgets.hits({
    container: '#hits',
    templates: {
      item: '<div>{{#helpers.highlight}}{ "attribute": "name" }{{/helpers.highlight}}</div>'
    }
  })
);

Refinement List

The refinement list widget allows users to filter search results based on specific attributes, such as categories. It provides checkboxes for each attribute value.

search.addWidget(
  instantsearch.widgets.refinementList({
    container: '#refinement-list',
    attribute: 'categories'
  })
);

Pagination

The pagination widget enables users to navigate through pages of search results. It provides controls for moving to the next or previous page and jumping to specific pages.

search.addWidget(
  instantsearch.widgets.pagination({
    container: '#pagination'
  })
);

Other packages similar to instantsearch.js

react-instantsearch

react-instantsearch is a library for building Algolia search interfaces in React. It provides React components that wrap instantsearch.js widgets, making it easier to integrate with React applications. Compared to instantsearch.js, it is more suitable for React-based projects.

searchkit

searchkit is a suite of UI components built in React to create search experiences powered by Elasticsearch. It offers a similar set of features to instantsearch.js but is designed to work with Elasticsearch instead of Algolia.

README

Table of Contents generated with DocToc

• InstantSearch.js
• Documentation
• Contributing, dev, release

InstantSearch projects: InstantSearch.js | React InstantSearch | InstantSearch Android.

InstantSearch.js

⚡ Lightning-fast search for your apps

Built by Algolia.

This repository holds the code for the InstantSearch.js project.

Documentation

There's a dedicated documentation available at https://community.algolia.com/instantsearch.js.

Contributing, dev, release

We welcome all contributors, from casual to regular. You are only one command away to start the developer environment, read our CONTRIBUTING guide.